package com.example.jetpackcomposebasic01

import android.os.Bundle
import android.widget.LinearLayout
import androidx.activity.ComponentActivity
import androidx.activity.compose.setContent
import androidx.compose.foundation.Image
import androidx.compose.foundation.background
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.layout.size
import androidx.compose.foundation.shape.CircleShape
import androidx.compose.material3.MaterialTheme
import androidx.compose.material3.Text
import androidx.compose.runtime.Composable
import androidx.compose.ui.Modifier
import androidx.compose.ui.draw.clip
import androidx.compose.ui.layout.ContentScale
import androidx.compose.ui.res.painterResource
import androidx.compose.ui.tooling.preview.Preview
import androidx.compose.ui.unit.dp
import com.example.jetpackcomposebasic01.ui.theme.Dn_LearningTheme

/**
 * 动脑学院-compose 学习
 *
 * 06-Material Design
 * https://www.bilibili.com/video/BV1ob4y1a7ad/?p=6&spm_id_from=pageDriver&vd_source=e07cc8cc94eb22bd76722071b03cd199
 *
 *
 * 1. 暗黑模式切换
 *
 */
class MainActivity04 : ComponentActivity() {


    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContent {
           Dn_LearningTheme {
               MessageCard(
                   msg = Message(
                       auth = "tianshen",
                       body = "龙神",
                   )
               )
           }
        }
    }

    @Composable
    fun MessageCard(msg: Message) {
        /*
            Row : 水平布局，类似 LinearLayout 的 LinearLayout.HORIZONTAL 形式
            Colum : 垂直布局，类似 LinearLayout 的 LinearLayout.VERTICAL 形式
         */


        Row(modifier = Modifier
            .padding(8.dp)
            .background(
                color = MaterialTheme.colorScheme.background
            )) {
            Image(
                painter = painterResource(id = R.drawable.girl), // 加载本地图片
                contentDescription = null, // 无障碍模式的时候的提示文案
                contentScale = ContentScale.Crop, // 图片的缩放模式
                modifier = Modifier
                    .size(44.dp, 44.dp)
                    .clip(CircleShape) // 设置裁剪图片，这里是裁剪成圆形
            )
            Column {
                Text(text = msg.auth)
                Text(text = msg.body)
            }
        }
    }

    @Preview
    @Composable
    fun PreviewMessageCard() {
        MessageCard(
            msg = Message(
                auth = "tianshen",
                body = "龙神",
            )
        )
    }


    data class Message(val auth: String, val body: String)
}

